<template>
  <div>
    <el-dialog :title='option.title' :visible.sync='option.isShow'  width="760px" @open="openUpdate" @close="closeUpdete"
            :close-on-click-modal=false >
      <div v-loading="loading">
        <el-card>
          <el-form ref='menuModelForm' :model='menuModelForm' size="mini" :rules="rules" label-width="110px" label-position="left">
            <el-row :gutter="40">
              <el-col :span='12' >
                <el-form-item label="应用编号:" prop='appId'>
                  <el-select v-model="menuModelForm.appId"  :disabled="option.isDisabled"
                   placeholder="请选择应用编号">
                    <el-option
                    v-for="item in appId"
                    :key="item.AppNum"
                    :label="item.AppNum+'-'+item.AppName"
                    :value="item.AppNum"
                    :disabled="item.disabled">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span='12'>
                <el-form-item label="菜单视图编号:" prop='menuViewId'>
                  <el-input v-model="menuModelForm.menuViewId" :disabled="option.isDisabled" placeholder="请输入菜单视图编号"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="40">
              <el-col  :span='12'  >
                <el-form-item label="菜单视图名称:" prop='menuViewName'>
                  <el-input v-model="menuModelForm.menuViewName"  placeholder="请输入菜单视图名称"></el-input>
                </el-form-item>
              </el-col>
              <el-col  :span='12' >
                <el-form-item label="排序号:" prop='menuNum'>
                   <!-- <el-input-number v-model="menuModelForm.menuNum"  :min="1" :max="10" label="请输入排序号"></el-input-number> -->
                  <el-input v-model="menuModelForm.menuNum"  placeholder="请输入排序号"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-card>
        <el-row style="margin:20px 0;text-align:right">
          <el-button  size='mini' @click="option.isShow=false">返回</el-button>
          <el-button type='primary' size='mini' @click="ItemUpdate">确定</el-button>
        </el-row>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import request from "@/common/utils/request";
import getGlobalParams from "@/common/utils/getGlobalParams";
import menuAdd from "@/message/resourceManage/menu/menuModel/menu-model-Add";
import menuUpdate from "@/message/resourceManage/menu/menuModel/menu-model-update";
import appQuery from "@/message/shared/appquery"; //应用编号

export default {
  props: { option: Object },
  data() {
    var validateNumber = (rule, value, callback) => {
      if (!value) {
        return callback(new Error("排序号不能为空"));
      }
      if (!Number(value)) {
        callback(new Error("请输入数字值"));
      } else {
        callback();
      }
    };
    return {
      loading: false,
      appId: [],
      menuModelForm: {
        menuNum: "",
        menuViewName: "",
        menuViewId: "",
        appId: ""
      },
      rules: {
        menuNum: [
          { required: true, message: "请输入排序号", trigger: "blur" },
          { validator: validateNumber, trigger: "blur" }
        ],
        menuViewName: [
          { required: true, message: "请输入视图名称", trigger: "blur" }
        ],
        menuViewId: [
          { required: true, message: "请输入视图编号", trigger: "blur" }
        ],
        appId: [
          { required: true, message: "请选择应用编号", trigger: "change" }
        ]
      }
    };
  },
  created() {
    this.fileUploadUrl = getGlobalParams.get("menuImgFileUploadAddress");
    this.fileDownloadUrl = getGlobalParams.get("menuImgDownloadAddress");
  },
  methods: {
    openUpdate() {
      this.initData();
      if (this.option.mark=="2") {
        this.setData();
      }else{
        if (this.$refs.menuModelForm) {
          this.$refs.menuModelForm.clearValidate(); //清楚表单验证
        }
        this.menuModelForm= {
        menuNum: "",
        menuViewName: "",
        menuViewId: "",
        appId: ""
      }
      }
    },
    setData(){ //设置修改回显数据
      this.menuModelForm.menuNum=this.option.currentRow.sortnum;
      this.menuModelForm.menuViewName=this.option.currentRow.menuviewname;
      this.menuModelForm.menuViewId=this.option.currentRow.menuviewnum;
      this.menuModelForm.appId=this.option.currentRow.appnum;
    },
    initData(){ //初始化下拉框
      this.loading = true;
      let resBody1 = new appQuery();
      resBody1.data.UserNum = this.$store.getters.UserNum;
      request(resBody1)
        .then(response => {
          if (response.APP_HEAD.ReturnCode === "000000") {
            this.loading = false;
            this.appId = response.RspInfo.Result;
          } else {
            this.loading = false;
            this.$message({
              type: "warning",
              message: SYS_HEAD.ReturnMessage
            });
          }
        })
        .catch(error => {
          this.loading = false;
          //   this.logger.log("fail", error);
        });
    },
    closeUpdete() {
      this.$refs.menuModelForm.resetFields(); //清楚表单验证
      this.$refs.menuModelForm.clearValidate(); //清楚表单验证
    },
    ItemUpdate() {
      this.$refs.menuModelForm.validate(valid => {
        if (valid) {
          this.loading = true;
          let resBody = this.option.mark == "1" ? new menuAdd() : new menuUpdate();
          resBody.data.AppNum = this.menuModelForm.appId;
          resBody.data.MenuViewNum = this.menuModelForm.menuViewId;
          resBody.data.MenuViewName = this.menuModelForm.menuViewName;
          resBody.data.SortNum = this.menuModelForm.menuNum;
            request(resBody)
              .then(response => {
                if (response.APP_HEAD.ReturnCode === "000000") {
                  this.$emit("refreshTable");
                  this.option.isShow=false;
                  let mes = this.option.mark == "1" ? "创建" : "修改";
                  this.$message({
                    type: "success",
                    message: `菜单视图${mes}${response.SYS_HEAD.ReturnMessage}!`
                  });
                } else {
                  this.$message({
                    type: "error",
                    message: `${response.SYS_HEAD.ReturnMessage}!`
                  });
                }
                this.loading = false;

                this.isShow = false;
              })
              .catch(error => {
                this.loading = false;
              });
        } else {
          this.$message({
            type: "warning",
            message: "请输入合法的数据！"
          });
          return false;
        }
      });
    }
  }
};
</script>

<style lang="scss">
</style>
